const path = require('path')
,HtmlWebpackPlugin = require('html-webpack-plugin')
,{CleanWebpackPlugin} = require('clean-webpack-plugin');

module.exports = {
    mode:'development'
    //目标环境为浏览器时，使用es5语法 
    ,target: ['web', 'es5']
    ,entry:{
        page1:'./src/js/page1.js'
        ,page2:'./src/js/page2.js'
    }
    ,output:{
        path:path.resolve(__dirname,'./dist')
        // name：值是entry对象的key。hash：随机生成7位哈希值
        ,filename:'[name].js'
        ,publicPath: "/dist/"
    }
    //loader的配置
    ,module:{
        rules:[
            //babel-loader转换为es5
            {
                test: /\.js$/
                ,exclude: /(node_modules|bower_components)/
                ,use: [
                    {
                        loader: 'babel-loader'
                        ,options: {
                            presets: ['@babel/preset-env']
                        }
                    }
                ]
            }
        ]
    }
    ,plugins:[
        //自动dist
        new CleanWebpackPlugin()
        ,new HtmlWebpackPlugin({
            //对应页面的js
            chunks:['page1']
            //生成的文件名
            ,filename:'page1.[contenthash:6].html'
            ,template:'./src/common/container.html'
            ,title:'page1'
            ,minify:{
                collapseWhitespace: true
                ,removeComments: true
                ,removeRedundantAttributes: true
                ,removeScriptTypeAttributes: true
                ,removeStyleLinkTypeAttributes: true
                ,useShortDoctype: true
            }
        })
        ,new HtmlWebpackPlugin({
            //对应页面的js
            chunks:['page2']
            //生成的文件名
            ,filename:'page2.[contenthash:6].html'
            ,template:'./src/common/container.html'
            ,title:'page2'
            ,minify:{
                collapseWhitespace: true
                ,removeComments: true
                ,removeRedundantAttributes: true
                ,removeScriptTypeAttributes: true
                ,removeStyleLinkTypeAttributes: true
                ,useShortDoctype: true
            }
            // ,templateParameters:{
            //     context:'/'
            // }
        })
    ]
    //静态服务器
    ,devServer:{
        //服务器资源地址
        contentBase: path.resolve(__dirname, './dist')
        ,host:'localhost'
        ,port: 9000
        //为每个静态文件开启gizp压缩
        ,compress: true
        ,open:true
        ,hot: true
    }
}